@import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,700,300italic,400italic,700italic|Source+Code+Pro:300,400,500);
@import url(//fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i|Roboto+Slab:100,300,400,700);

signal-container {
    font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: rgb(45, 46, 48);
    font-size: 100%;
    line-height: 1.5em;
    font-size: 16px;
}

signal-container p {
    margin: 0.5em 0;
}

.font-serif {
    font-family: 'Crimson Text';
}
.font-slab {
    font-family: 'Roboto Slab';
}

.font-monospace, code-mirror, code, pre {
    font-family: 'Source Code Pro', monospace;
    font-weight: 500;
}
code {
    padding: 0 0.24em;
}

/* Spacing in markdown */

.md-heading {
    margin-bottom: 0.33em;
    margin-top: 0.66em;
}

.md-codeblock {
    padding-left: 2rem;
}

.md-paragraph {
    margin: 0.66em 0;
}

.blockquote {
    color: #666;
    border-left: 4px solid #999;
    padding-left: 1em;
}

.md-blockquote {
    margin: 1em;
}

.font-uppercase {
    text-transform: uppercase;
}

.font-lowercase { text-transform: lowercase; }

.font-xx-small { font-size: xx-small; }
.font-x-small { font-size: x-small; }
.font-small { font-size: small; }
.font-medium { font-size: medium; }
.font-large { font-size: large; }
.font-x-large { font-size: x-large; }
.font-xx-large { font-size: xx-large; }

.font-bold { font-weight: bold; }
.font-bolder { font-weight: bolder; }
.font-lighter {font-weight: lighter; }

.font-italic { font-style: italic; }

/* Material design */
/* This was adapted from https://github.com/nevir/paper-theme-experiment/blob/master/global/typography.html */

.title-4 {
  font-family: 'Source Sans Pro';
  color: #757575;
  font-size: 112px;
  font-weight: 200;
  line-height: 1.1em;  /* guessed */
  text-indent: -0.089em;
  text-rendering: optimizeLegibility;
}
.title-3 {
    font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 56px;
  font-weight: 200;
  letter-spacing: -.026em;
  line-height: 1.1em;  /* guessed */
  text-indent: -0.082em;
  text-rendering: optimizeLegibility;
}

.title-2 {
  font-family: 'Source Sans Pro';
  color: #252525;
  font-size: 45px;
  font-weight: 300;
  letter-spacing: -.018em;
  line-height: 48px;
  text-indent: -0.08em;
  text-rendering: optimizeLegibility;
}

.title-1 {
  font-family: 'Source Sans Pro';
  color: #757575;
  font-size: 34px;
  font-weight: 400;
  letter-spacing: -.01em;
  line-height: 40px;
  text-rendering: optimizeLegibility;
}

.title {
  font-family: Raleway;
  color: #212121;
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;  /* guessed */
  text-rendering: optimizeLegibility;
}

.subhead {
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;  /* guessed */
  text-rendering: optimizeLegibility;
}

.heading-3 {
  color: #212121;
  font-size: 24px;
  font-weight: 400;
  letter-spacing: -.012em;
  line-height: 32px;
  text-rendering: optimizeLegibility;
}

.heading-2 {
  color: #212121;
  font-size: 24px;
  font-weight: 300;
  line-height: 32px;
  text-rendering: optimizeLegibility;
}

.heading-1 {
  font-family: 'Source Sans Pro';
  color: #515151;
  font-size: 28px;
  font-weight: 500;
  line-height: 38px;
  text-rendering: optimizeLegibility;
}

signal-container a, signal-container a:visited {
    color: #0082c6;
    text-decoration: none;
}
.caption {
  color: #757575;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.011em;
  line-height: 22px;  /* guessed */
}

paper-button {
    border: 1px #C2C2B2 solid;
    padding-left: 1em;
    padding-right: 1em;
}

signal-container ul, signal-container ol {
    padding-left: 1.25em;
}
signal-container ul li {
    list-style: disc;
}
signal-container ul li:first-child, ul li:last-child {
    padding: 0;
}
signal-container em, .emph {
    font-style: italic;
}

.scrollbar::-webkit-scrollbar {
  width: 8px;
}

.scrollbar::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1); 
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.scrollbar::-webkit-scrollbar-thumb {
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background: rgba(0,0,0,0.1); 
}
    
.scrollbar::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255,0,0,0.2); 
}
